<!DOCTYPE html>
<html>
<head>
    <% include ../include/css_header.html %>
    <link type="text/css" rel="stylesheet" href="/min/mobiscroll.min.css" />
    <style>
        #tags h4{
            float: left;
            margin-right: 5px;
        }
    </style>
</head>
<body class="actlist_bg">
    <div class="container">
        <div style="margin-top: 10px;">
            <a class="icon-arrow-left" style="color: #ffffff;font-size: 24px;" href="/myfactions"></a>
        </div>
        <div class="font_shadow_133000" style="text-align: center;color: #ffffff;">
            <h2><strong><%=faction? '圈子信息' : '创建圈子'%></strong></h2>
        </div>
        <div class="row" style="margin: 0;">
            <div class="bg_op_panel" style="min-height: 620px;">
                <div class="col-xs-12" style="margin-top: 10px;">
                    <form id="factionForm" method="post" enctype="multipart/form-data" action="/saveFaction">
                        <div class="form-group">
                            <label>创始人</label>
                            <div class="bg_white_panel">
                                <img class="img-rounded size_48" src="/img/<%=creator.id %>" /> <%=creator.name %>
                            </div>
                        </div>
                        <div class="form-group">
                            <label>圈名称</label>
                            <input type="text" id="name" name="name" class="form-control" placeholder="求V5霸气的名字" value="<%=(faction && faction.name) || ''%>">
                        </div>
                        <div class="form-group">
                            <label>圈简介</label>
                            <textarea class="form-control" rows="4" name="description" id="description" placeholder="简要描述一下创建圈子的目的，吸引更多志同道合的伙伴加入哦～"><%=(faction && faction.description) || '' %></textarea>
                        </div>
                        <div class="form-group">
                            <label>圈标签</label>
                            <div id="tags">
                                <% if(faction){ %>
                                <% faction.tags.forEach(function(tag){ %>
                                <h4 data-tag="<%=tag %>">
                                    <span class="label label-primary">
                                        <%=tag %>
                                        <i class="icon-cross"></i>
                                    </span>
                                </h4>
                                <% }) %>
                                <% }else{ %>
                                <h4 data-tag="交流">
                                    <span class="label label-primary">
                                        交流
                                        <i class="icon-cross"></i>
                                    </span>
                                </h4>
                                <% } %>
                                <h4 style="color: #666666;" data-toggle="modal" data-target="#newTag">
                                    <span class="icon-plus" style="border: 1px dotted"></span>
                                </h4>
                                <div class="clearfix"></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label>圈子Logo</label>
                            <input type="file" name="logofile"/>
                        </div>
                        <% if(faction){ %>
                        <div class="form-group">
                            <img src="/flogo/<%=faction._id %>.jpg" class="img-rounded" style="max-width: 56px"
                                 onError="this.src='/img/<%=faction.creator.id %>';">
                        </div>
                        <% } %>
                        <input type="hidden" name="_csrf" id="_csrf" value="<%=token %>"/>
                        <input type="hidden" name="tags" id="tagArr" value=""/>
                        <% if(faction){ %>
                        <input type="hidden" name="factionId" id="factionId" value="<%=faction._id %>">
                        <% } %>
                        <button type="button" class="btn btn-success btn-block" data-loading-text="Loading..." id="submitBtn"><%=faction? '更新圈子信息' : '创建圈子'%></button>
                        <button type="button" class="btn btn-default btn-block" id="goback">返回</button>
                    </form>
                </div>
            </div>
        </div>
        <div class="modal fade" id="newTag" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-body">
                        <input class="form-control" type="text" value="" id="tagContent" placeholder="标签"/>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-success" id="addBtn">添加</button>
                    </div>
                </div>
            </div>
        </div>
        <% include ../include/copyright.html %>
    </div>
<% include ../include/js_footer.html %>
<script src="/min/mobiscroll.min.js"></script>
<script src="<%=_locals.static_js_path %>/newfaction.js"></script>
<script>

</script>
</body>
</html>